<template>
    <div class="repositories_b">
        <Header/>
        <div class="third_show bh_500">
            <img src="../assets/temp/bb3_a_web.jpg" class="imgshow">
            <div class="text pages_w1470">
                <div class="en">{{casedata.alias}}</div>
                <div class="cn">{{casedata.name}}</div>
            </div>
        </div>
        <div class="second_box">

            <div class="pages_w1145 pa_70 fl-clr">
                <div class="repositories-title"><img :src="$store.state.domain+detail.pic"></div>
                <div class="fl-clr" data-details="rd">
                    <div class="bw_850 fl">
                        <div class="scientific_details">
                            <div class="text" v-html="detail.content"></div>
                            <div class="details_bottom fl-clr" v-if="pn">
                                <router-link v-if="pn.p" :to="{name:'repositories_details',params: { id: pn.p.id }}" class="a prev"></router-link>
                                <router-link :to="{name:'repositories'}" class="a return"></router-link>
                                <router-link v-if="pn.n" :to="{name:'repositories_details',params: { id: pn.n.id }}" class="a next"></router-link>
                            </div>
                        </div>
                    </div>
                    <div class="bw_260 fr" data-details="rdbox">
                        <div class="scientific_rd">
                            <img src="../assets/temp/cs40.jpg">
                            <dl>
                                <dt>推荐临床研究</dt>
                                <dd>
                                    <p v-for="(item,index) in list" :key="index"><router-link :to="{name:'products_brand_details',params: { id: item.id }}">{{item.name}}</router-link></p>
                                </dd>
                            </dl>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <Footer/>

    </div>
</template>





<script>
import Header from '../components/Header.vue'
import Footer from '../components/Footer.vue'
export default {
    components: {
        Footer,Header
    },
    data () {
        return {
            list: [],
            pn: {},
            detail: {},
            casedata: {},
            background: '',
        }
    },
    mounted () {

        $(window).scroll(function(){
            if($('[data-details="rd"]').length>0){
                if ($(window).scrollTop()>$('[data-details="rd"]').offset().top) {
                    $('[data-details="rdbox"]').addClass('details-fixed-r');
                } else {
                    $('[data-details="rdbox"]').removeClass('details-fixed-r');
                }
            }
        })

        this.getData();
    },
    methods: {
        getData () {
            this.$axios.get(this.$store.state.domain+'/Multi/index.json', { params: this.$route.params }).then(res => {

                //this.$emit('mywatch2')
                this.detail = res.data.newsdata
                this.list = res.data.newslist
                this.pn = res.data.pn
                this.casedata = res.data.casedata
                if (this.detail.banners) {
                    this.background = {
                        backgroundImage: `url(${this.detail.banners})`
                    }
                }
            });
        },
    },
    watch: {
        $route () {
            this.getData();
        }
    }
}

</script>
